<script lang="tsx">
/**
 * 项目销售管理
 */
export default {
  name: "develop-project-sales"
}
</script>

<script lang="tsx" setup>


import {ref} from "vue";
import {convertEnumToList, definePageModel, PageModel, processRequest,ImgUpload} from "@/framework";
import {SaleStatus} from "@/pages/develop-project/develop-project-sales/index.ts";
import {ElMessage, ElMessageBox} from "element-plus";
import APIS from "@/apis";
import {useReflectionData} from "@/pages/develop-project/develop-project-sales/use-refection-data.ts";

import SalesMoney from "./components/sales-money/index.vue"
import CommitProject from "./components/commit-project/index.vue"
import Payment from "./components/payment/index.vue"
import {DevelopItemStatusEnum} from "@/pages/develop-project/develop-project-development/index.ts";

/**
 * 获取映射数据
 */
const {reflections, getReflectionData} = useReflectionData()
getReflectionData()


/**
 * 页面模型
 */
const pageModelRef = ref()
const config = definePageModel<any>({
  url: APIS.DEVELOP_PROJECT_SALES_BASE,
  otherParams: {
    id: null
  },
  searchForm: {
    beforeSubmit(data) {
      if (data.endTime) {
        data.endTime += " 23:59:59"
      }
      return data
    },
    els: [
      {
        eType: "el-input",
        prop: "code",
        props: {
          placeholder: "销售编码",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "project",
        props: {
          placeholder: "项目信息",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "saleStaffName",
        props: {
          placeholder: "销售人员姓名",
          clearable: true
        }
      },
      {
        eType: "el-select",
        prop: "saleStatus",
        props: {
          placeholder: "销售状态",
          clearable: true
        },
        optionsData: {
          list: convertEnumToList(SaleStatus),
          label: "label",
          value: "value"
        }
      },
      {
        eType: "el-date-picker",
        prop: "startTime",
        props: {
          valueFormat: "YYYY-MM-DD",
          placeholder: "创建时间-起始",
          clearable: true
        }
      },
      {
        eType: "el-date-picker",
        prop: "endTime",
        props: {
          valueFormat: "YYYY-MM-DD",
          placeholder: "创建时间-结束",
          clearable: true
        }
      },
    ]
  },
  programForm: {
    els: [
      {
        label: "新增",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "add"
      },
      {
        label: "删除",
        eType: "el-button",
        props: {
          type: "danger"
        },
        event: "delete-multi"
      },
      {
        label: "沟通",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "communication-multi"
      },
      {
        label: "取消",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "cancel-multi"
      },
      {
        label: "完成",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "finish-multi"
      },
    ]
  },
  table: {
    page: {
      enable: true,
      pageSize: 20
    },
    selection: true,
    operation: {
      width: 240,
      props:{
        fixed:"right"
      },
      els: [
        {
          eType: "el-button",
          label: "项目金额",
          event: "project-amount",
          props: {
            type: "primary",
            link: true
          }
        },
        {
          eType: "el-button",
          label: "下定项目",
          event: "commit-project",
          props: {
            type: "primary",
            link: true
          }
        },
        {
          eType: "el-button",
          label: "付款",
          event: "payment",
          props: {
            type: "primary",
            link: true
          }
        },
        {
          eType: "el-button",
          label: "编辑",
          event: "edit",
          props: {
            type: "primary",
            link: true
          }
        },
        {
          eType: "el-button",
          label: "删除",
          event: "delete",
          props: {
            type: "primary",
            link: true
          }
        },
      ]
    },
    props: {
      stripe: true,
      border: true
    },
    els: [
      {
        label: "项目编码",
        prop: "projectCode",
        minWidth: 120
      },
      {
        label: "项目名称",
        prop: "projectName",
        minWidth: 120
      },
      {
        label: "销售人员姓名",
        prop: "saleStaffName",
        minWidth: 120
      },
      {
        label: "销售状态",
        prop: "saleStatus",
        minWidth: 120,
        renderFn(data) {
          return <span>{SaleStatus[data.saleStatus]}</span>
        },
      },
      {
        label: "备注",
        prop: "remark",
        minWidth: 120
      },
      {
        label: "创建人姓名",
        prop: "createStaffName",
        minWidth: 120
      },
      {
        label: "已付金额",
        prop: "payAmount",
        minWidth: 120
      },
      {
        label: "总金额",
        prop: "totalAmount",
        minWidth: 120
      },
      {
        label: "创建时间",
        prop: "createTime",
        minWidth: 140,
        renderFn(data) {
          return <span>{data.createTime?.toDate()}</span>
        },
      }
    ]
  },
  form: {
    title: "新增/编辑",
    width: 500,
    sheetForm: {
      labelWidth: "110px",
      required: ['code', 'projectId','saleStaffId'],
      els: [
        {
          label: "项目名称",
          prop: "projectId",
          eType: "el-select",
          props: {
            placeholder: "项目名称",
            clearable: true
          },
          optionsData: {
            reflect: "projectList",
            label: "name",
            value: "id"
          }
        },
        {
          label: "销售人员名称",
          prop: "saleStaffId",
          eType: "el-select",
          props: {
            placeholder: "销售人员名称",
            clearable: true
          },
          optionsData: {
            reflect: "saleStaffList",
            label: "name",
            value: "id"
          }
        },
        {
          label: "附件",
          renderFn(data: any) {
            /**
             * 监听修改
             */
            const handleChange = (value: any) => {
              data.icon = value
            }

            return <ImgUpload onChange={handleChange} data={data.icon} limit={1}/>
          }
        },
        {
          label: "备注",
          prop: "remark",
          eType: "el-input",
          props: {
            placeholder: "备注",
            clearable: true,
            type: "textarea",
            rows: 3
          },
        },
      ]
    }
  }
})

/**
 * 刷新
 */
const handleRefresh = (clear: boolean = false) => {
  pageModelRef.value.refreshTableData()
  clear && pageModelRef.value.clearSelection()
}

/**
 * 新增
 */
const handleAdd = () => {
  pageModelRef.value.handleAdd()
}

/**
 * 编辑
 */
const handleEdit = (row: any) => {
  pageModelRef.value.handleEdit(row)
}

/**
 * 删除
 */
const handleDelete = (row: any) => {
  pageModelRef.value.handleDelete(row)
}

/**
 * 删除 - 批量
 */
const handleDeleteMulti = async () => {
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData) {
    ElMessage.warning("请先选择一条数据")
    return false
  }
  await ElMessageBox.confirm("是否确认删除?", "删除", {
    type: "error"
  })
  await processRequest.post('/api/DevelopProjectSale/DeleteMulti', {
    ids: selectData.map((item: any) => item.id)
  })

  ElMessage.success("删除成功")
  handleRefresh()
}

/**
 * 沟通中 - 批量
 */
const handleCommunicationMulti = async ()=>{
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData){
    ElMessage.warning("情先选择一条数据")
    return false
  }
  const list = selectData.some((item: any) => item.saleStatus !== SaleStatus['潜在客户']);
  if (list) {
    ElMessage.warning("只有潜在客户的项目才可以沟通");
    return false;
  }
  await ElMessageBox.confirm("是否确认沟通中","沟通中",{
    type:"warning"
  })
  await processRequest.post('/api/DevelopProjectSale/CommunicateMulti',{
    ids:selectData.map((item:any)=>item.id)
  })

  ElMessage.success("状态修改成功")
  handleRefresh()
}

/**
 * 取消 - 批量
 */
const handleCancelMulti = async ()=>{
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData){
    ElMessage.warning("情先选择一条数据")
    return false
  }
  const list = selectData.some((item: any) => item.saleStatus === SaleStatus['已完成'] || item.saleStatus === SaleStatus['已取消']);
  if (list) {
    ElMessage.warning("只有不是已完成和已取消的项目才可以取消");
    return false;
  }
  await ElMessageBox.confirm("是否确认取消","取消",{
    type:"warning"
  })
  await processRequest.post('/api/DevelopProjectSale/CancelMulti',{
    ids:selectData.map((item:any)=>item.id)
  })

  ElMessage.success("状态修改成功")
  handleRefresh()
}

/**
 * 完成 - 批量
 */
const handleFinishMulti = async ()=>{
  const selectData = pageModelRef.value.getTableSelectData()
  if (!selectData){
    ElMessage.warning("情先选择一条数据")
    return false
  }
  const list = selectData.some((item: any) => item.saleStatus === SaleStatus['已完成'] || item.saleStatus === SaleStatus['已取消']);
  if (list) {
    ElMessage.warning("只有不是已完成和已取消的项目才可以取消");
    return false;
  }
  await ElMessageBox.confirm("是否确认取消","取消",{
    type:"warning"
  })
  await processRequest.post('/api/DevelopProjectSale/FinishMulti',{
    ids:selectData.map((item:any)=>item.id)
  })

  ElMessage.success("状态修改成功")
  handleRefresh()
}

/**
 * 项目金额
 */
const salesMoneyRef = ref()
const handleSalesMoney = (row: any) => {
  if (row.saleStatus !== SaleStatus['沟通中']) {
    ElMessage.warning("只有沟通中的项目才可以下定金额");
    return false;
  }
  salesMoneyRef.value.show({
    id: row.id
  })
}

/**
 * 下定项目
 */
const commitProjectRef = ref()
const handleCommitProject = (row: any) => {
  if (row.saleStatus !== SaleStatus['待付款']) {
    ElMessage.warning("只有待付款的项目才可以下定金额");
    return false;
  }
  commitProjectRef.value.show({
    id: row.id
  })
}

/**
 * 付款
 */
const paymentRef = ref()
const handlePayment = (row: any) => {
  paymentRef.value.show({
    id: row.id
  })
}

</script>

<template>
  <PageModel ref="pageModelRef" :PageModel="config" :reflections="reflections" @add="handleAdd" @delete="handleDelete"
             @edit="handleEdit" @delete-multi="handleDeleteMulti" @communication-multi="handleCommunicationMulti"
             @project-amount="handleSalesMoney" @cancel-multi="handleCancelMulti" @finish-multi="handleFinishMulti"
              @commit-project="handleCommitProject" @payment="handlePayment"/>

  <SalesMoney ref="salesMoneyRef" @confirm="handleRefresh"/>
  <CommitProject ref="commitProjectRef" @confirm="handleRefresh"/>
  <Payment ref="paymentRef" @confirm="handleRefresh"/>
</template>

<style lang="scss" scoped>

</style>